<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>下拉菜单</title>
    <style type="text/css">
        *{
			margin:0;
			padding:0;
			list-style:none;
		}
        #con{
			width:400px;
			margin:100px auto;
		}
         ul {
			width:100px;
			height:30px;
			line-height:30px;
			text-align:center;
		}
		li{
			width:100px;
			text-align:center;
		}
		.gd{
			background:blue;
		}
         a{
			text-decoration:none;
			color:black;
			width:100px;
		}
        a:hover{
			background:white;
		}
         ul ul{
			display:none;
		}
    </style>
</head>
<body>
    <div id="con">
         <ul>
            <li  onmouseover="display(this)" onmouseout="hide(this)">
                <a href="#" class="gd" >更多产品</a>
                <ul> 
					<li> <img src="picture.png"/><br/><a id="nuomi" href="http://www.nuomi.com/?cid=002540" name="nuomi"><span class="nuomi">糯米</span></a></li>
					<li><img src="picture.png"/><br/><a id="yinyue" href="http://music.taihe.com" name="yinyue"><span class="yinyue">音乐</span></a></li>
					<li><img src="picture.png"/><br/><a id="tupian" href="http://image.baidu.com" name="tupian"><span class="tupian">图片</span></a></li>
					<li><img src="picture.png"/><br/><a id="zhidao" href="http://zhidao.baidu.com" name="zhidao"><span class="zhidao">知道</span></a></li>
					<li><img src="picture.png"/><br/><a id="wenku" href="http://wenku.baidu.com" name="wenku"><span class="wenku">文库</span></a></li>
					<li><img src="picture.png"/><br/><a id="fyb" href="http://top.baidu.com" name="fyb"><span class="fyb">风云榜</span></a></li>
					<li><a id="qbcp" href="//www.baidu.com/more/" name="qbcp"><span class="qbcp">全部产品</span></a></li>	
                </ul>
            </li>
            
        </ul>
    </div>
</body>
</html>
 <script type="text/javascript">
	function display(li){
		var listtr1=li.getElementsByTagName("ul")[0];
		listtr1.style.display='block';
	}  
	function hide(li){
		var listtr1=li.getElementsByTagName("ul")[0];
		listtr1.style.display='none';
	}
</script>